<template>
    <div class="site-content">
        <div class="site-content-header-tag">
            <el-tag
            v-for="tag in tags"
            :key="tag.name"
            class="tag"
            closable>
            {{tag.name}}
            </el-tag>
        </div>
        <div class="site-content-inner">
            <div class="site-content-main">
                <keep-alive>
                    <router-view />
                </keep-alive>
            </div>
        </div>
    </div>
</template>

<script>
  export default {                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                      
    data () {
      return {
          tags: []
      }
    },
  }
</script>
<style  scoped lang="less">
    .site-content{
        padding-bottom: 30px;
        width: 100%;
        height: 100%;
        transition: left .3s ease-in-out;
        background: #f1f4f5;
        .site-content-header-tag{
                width: 100%;
                height: 32px;
                text-align: left;
                background: #fff;
                box-shadow: 0px 7px 14px -14px #616161;
            .tag{
                color: #292929;
                font-family: 微软雅黑;
                font-size: 14px;
                background: #fff;
                border: none;
            }
        }
        .site-content-inner{
            background: #f1f4f5;
            width: auto;
            height: 100%;
            padding-top: 8px;
            padding-bottom: 90px;
            padding-left: 10px;
            padding-right: 10px;
            box-sizing: border-box;
            border-radius: 4px;
        }
    }
        .site-content-main{
            overflow-y: scroll;
            height: 100%;
            border-radius: 4px;
            background: #fff;
            overflow-x: hidden
        }
        .site-content-main::-webkit-scrollbar {
            width: 5px;
        }
        
        .site-content-main::-webkit-scrollbar-track {
            border-radius: 20px;
            background-color: #eee;
        }
        
        .site-content-main::-webkit-scrollbar-thumb {
            border-radius: 20px;
            background: #3DB6A4;
        }
</style>